<template>
  <PermissionContainer
    :jiBieArr="[2]"
    :tipArr="[, '班结只对站点级别开放', '', , '']"
  >
    <div>
      <el-form
        :model="queryParams"
        ref="queryForm"
        :inline="true"
        label-width="68px"
      >
        <el-form-item prop="carNumber"
          >开班时间：{{ opo.endDate }} 班结人：{{ opo.classStructureMan }}
        </el-form-item>
        <el-form-item>
          <el-button
            icon="el-icon-plus"
            type="primary"
            v-if="isclose"
            size="mini"
            @click="handleAdd"
            >添加班结</el-button
          >
        </el-form-item>
      </el-form>
      <!--按员工汇总-->
      <span style="color: #ff9955; font-size: 25px">|</span
      ><span style="font-size: 25px">按员工汇总</span>
      <el-table show-summary :data="structureList" :summary-method="getTotal">
        <el-table-column label="员工姓名" align="left" prop="oilPersonnel" />
        <el-table-column label="负责枪号" align="left" prop="oilGun" />
        <el-table-column label="销量" align="left" prop="orderLiters" />
        <el-table-column label="销额" align="left" prop="amt" />
        <el-table-column label="销售笔数" align="left" prop="orderNo" />
      </el-table>
      <!--按油品汇总-->
      <span style="color: #ff9955; font-size: 25px; padding-top: 15px">|</span
      ><span style="font-size: 25px">按油品汇总</span>
      <el-table :data="structureList1" show-summary :summary-method="getTotal2">
        <el-table-column label="油品" align="left" prop="oilName" />
        <el-table-column label="负责枪号" align="left" prop="oilGun" />
        <el-table-column label="销量" align="left" prop="orderLiters" />
        <el-table-column label="销额" align="left" prop="amt" />
        <el-table-column label="销售笔数" align="left" prop="orderNo" />
      </el-table>
      <!--按员工/支付方式汇总：    -->
      <span style="color: #ff9955; font-size: 25px; padding-top: 15px">|</span
      ><span style="font-size: 25px">按员工/支付方式汇总</span>
      <el-table :data="structureList3" show-summary :summary-method="getTotal3">
        <el-table-column label="员工姓名" align="left" prop="oilPersonnel" />
        <el-table-column label="负责枪号" align="left" prop="oilGun" />
        <el-table-column label="微信笔数" align="left" prop="wxNum" />
        <el-table-column label="支付宝笔数" align="left" prop="zfbNum" />
        <el-table-column label="现金笔数" align="left" prop="xjNum" />
        <el-table-column label="优惠" align="left" prop="discountAmt" />
        <el-table-column label="优惠劵" align="left" prop="discountCouponAmt" />
        <el-table-column label="微信金额" align="left" prop="wxAmt" />
        <el-table-column label="支付宝金额" align="left" prop="zfbAmt" />
        <el-table-column label="现金金额" align="left" prop="xjAmt" />
        <el-table-column label="会员卡支付" align="left" prop="dzkAmt" />
        <el-table-column label="退款金额" align="left" prop="refundAmt" />
      </el-table>
      <!-- 添加或修改班结管理对话框 -->
      <el-dialog
        :title="title"
        :visible.sync="open"
        width="500px"
        append-to-body
      >
        <span>请确认当前时间没有车主正在使用系统支付</span>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitForm">确 定</el-button>
          <el-button @click="cancel">取 消</el-button>
        </div>
      </el-dialog>
    </div>
  </PermissionContainer>
</template>

<script>
import {
  listPersonnelPayStructure,
  listClass,
  getAgeClassStructure,
  listPersonnelStructure,
  listOilStructure,
  addStructure,
  getPayOrderInfoMin,
  selectPersonnelStructure,
  selectPersonnelPayStructure,
  selectOilStructure,
} from "@/api/station/structure";

export default {
  name: "Station_Accounting",
  data() {
    return {
      // 班结管理表格数据
      structureList: [],
      structureList1: [],
      structureList3: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      //是否显示班结
      isclose: true,
      // 查询参数
      queryParams: {},
      stationOptions: [],
      opo: {
        classStructureMan: null,
        endDate: null,
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {},
      pageStatus: 0,
    };
  },
  created() {
    // 查询班结数据
    this.getStructure();
    this.initFromOrder();
  },
  methods: {
    async getStructure() {
      this.opo.classStructureMan = this.$store.state.user.name;
      const structureRes = await getAgeClassStructure();
      if (!structureRes.data) {
        // 油站第一次班结
        const PayOrderRes = await getPayOrderInfoMin();
        if (PayOrderRes.data == null) {
          this.opo.endDate = "";
        } else {
          this.opo.endDate = PayOrderRes.data.createdDate;
        }
        this.opo = {
          ...this.opo,
          endDate: PayOrderRes.data.createdDate,
        };
        return;
      } else {
        // 油站之前班结过
        this.opo.endDate = structureRes.data.endDate;
        this.opo = {
          ...this.opo,
          endDate: structureRes.data.endDate,
        };
        return;
      }
    },
    initFromOrder() {
      selectPersonnelStructure().then((response) => {
        this.structureList = response.rows;
      });
      selectOilStructure().then((response) => {
        this.structureList1 = response.rows;
      });
      selectPersonnelPayStructure().then((response) => {
        this.structureList3 = response.rows;
      });
    },
    /** 查询班结管理列表 */
    getList() {
      listPersonnelStructure(this.queryParams).then((response) => {
        this.structureList = response.rows;
      });
      listOilStructure(this.queryParams).then((response) => {
        this.structureList1 = response.rows;
      });
      listPersonnelPayStructure(this.queryParams).then((response) => {
        this.structureList3 = response.rows;
      });
    },
    getTotal(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        }
        const values = data.map((item) => Number(item[column.property]));
        if (column.property === "orderLiters") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "amt") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "orderNo") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(0);
        } else {
          sums[index] = "";
        }
      });
      return sums;
    },
    getTotal2(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        }
        const values = data.map((item) => Number(item[column.property]));
        if (column.property === "orderLiters") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "amt") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "orderNo") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(0);
        } else {
          sums[index] = "";
        }
      });
      return sums;
    },
    getTotal3(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        }
        const values = data.map((item) => Number(item[column.property]));
        if (column.property === "wxNum") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(0);
        } else if (column.property === "zfbNum") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(0);
        } else if (column.property === "xjNum") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(0);
        } else if (column.property === "discountAmt") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "discountCouponAmt") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "wxAmt") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "zfbAmt") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "xjAmt") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "dzkAmt") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else if (column.property === "refundAmt") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2);
        } else {
          sums[index] = "";
        }
      });
      return sums;
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        stationId: null,
        stationName: null,
        person: null,
        gunNo: null,
        salesVolume: null,
        salesAmount: null,
        discount: null,
        coupon: null,
        netReceipts: null,
        salesNum: null,
        printNum: null,
        classStructureNo: null,
        classStructureDate: null,
        classStructureMan: null,
      };
      this.resetForm("form");
    },
    resetQuery() {
      this.queryParams = {};
      this.resetForm("queryForm");
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();

      if (
        this.structureList3.length == 0 &&
        this.structureList1.length == 0 &&
        this.structureList.length == 0
      ) {
        this.msgSuccess("没有要班结的数据");
      } else {
        console.log(this.structureList3.length);
        console.log(this.structureList1.length);
        console.log(this.structureList.length);
        this.open = true;
        this.title = "添加班结管理";
      }
    },
    getClassInfo() {
      listClass(this.queryParams).then((response) => {
        this.opo = response.data;
        this.queryParams.classStructureNo = response.data.classStructureNo;
        this.queryParams.stationId = response.data.stationId;
        this.getList();
      });
    },
    /** 提交按钮 */
    submitForm() {
      //【**】
      this.form = {
        stationName: this.$store.state.user.stationName,
        classStructureMan: this.$store.state.user.name,
      };
      addStructure(this.form).then((response) => {
        this.msgSuccess("班结成功");
        this.open = false;
        this.queryParams.stationName = this.$store.state.user.stationName;
        this.queryParams.stationId = this.$store.state.user.stationId;
        this.queryParams.classStructureMan = this.$store.state.user.name;
        this.initFromOrder();
        this.isclose = false;
      });
    },
  },
};
</script>
